import Vue from "vue";

//购物车相关逻辑
export default {
  namespaced: true,
  state() {
    return {
      cartList: [
        {
          stock_id: 1000701,
          title: "畅呼吸防护口罩（花粉、粉尘、PM2.5、病菌）",
          sub_title: "五层防护、高达 98% 的平均过滤效率",
          image:
            "https://resource.smartisan.com/resource/ef67ff9577c62979930b356a37b86251.jpg",
          imgs: [
            "https://resource.smartisan.com/resource/ef67ff9577c62979930b356a37b86251.jpg",
            "https://resource.smartisan.com/resource/6e21fd5af69965142e1a50dca189eb7e.jpg",
          ],
          price: 99,
          limit_num: 3,
          detail: {
            color: "#FBF084",
            color_name: "绿色",
          },
          num:1,
          ischeck:false
        },
        {
          stock_id: 1000702,
          title: "畅呼吸防护口罩（花粉、粉尘、PM2.5、病菌）",
          sub_title: "五层防护、高达 98% 的平均过滤效率 粉色",
          image:
            "https://resource.smartisan.com/resource/07d77f3a1921fa06e4e5b2f1cdf1a7c8.jpg",
          imgs: [
            "https://resource.smartisan.com/resource/07d77f3a1921fa06e4e5b2f1cdf1a7c8.jpg",
            "https://resource.smartisan.com/resource/967c4d4519aaae1734c727a22def2537.jpg",
          ],
          price: 99,
          limit_num: 5,
          detail: {
            color: "#F8ACF4",
            color_name: "粉色",
          },
          num:2,
          ischeck:true
        },
      ]
    };
  },
  getters:{
    allInfo(state){
      let allNum=0 //总数
      let allPrice=0 //总价
      let allCheck = true  //全选状态
      let checkNum = 0  //已选数量
      let checkPrice = 0 //应付总额
      state.cartList.forEach(item=>{
        allNum += item.num
        allPrice += item.num * item.price
        if(!item.ischeck){
          allCheck = false
        }
        if(item.ischeck){
          checkNum += item.num
          checkPrice += item.num * item.price
        }
      })
      return {
        allNum,
        allPrice,
        allCheck,
        checkNum,
        checkPrice
      }
    }
  },
  mutations:{
    cartAddMut(state,obj){ //加入购物车
      // 判断购物车中是否已经存在相同商品
      let {cartList} = state
      let len = cartList.length
      for(let i=0;i<len;i++){
        if(cartList[i].stock_id===obj.stock_id){ 
          state.cartList[i].num++   //改变已有商品数量
          return
        }
      }
      // obj.num = 1  //非响应式数据字段，不能触发视图更新
      Vue.set(obj,'num',1) //响应式数据字段，能自定自动触发视图更新
      Vue.set(obj,'ischeck',true) 
      state.cartList.push(obj) //新增商品
    },
    cartDelMut(state,idx){ //删除购物车商品
      state.cartList.splice(idx,1)
    },
    cartCheckMut(state,idx){ //单选
      state.cartList[idx].ischeck = !state.cartList[idx].ischeck
    },
    cartAllCheckMut(state,bool){ //全选控制单选，bool代表原来的全选状态
      state.cartList.forEach(item=>{
        item.ischeck = !bool
      })
    },
    cartNumMut(state,{idx,bool=true}){  //数量加(bool=true)、减(bool=false)
      let {num,limit_num} = state.cartList[idx]
      // 方法1：
      // if(bool&&num<limit_num){
      //   state.cartList[idx].num++
      // }
      // if(!bool&&num>1){
      //   state.cartList[idx].num--
      // }
      // 方法2:
      if(bool&&num<limit_num || !bool&&num>1){
        let n = bool ? 1 : -1
        state.cartList[idx].num += n
      }
    }
  }
};
